<template>
  <a-modal
    ref="modal"
    :title="title"
    :width="1200"
    :mask-closable="false"
    :visible="visible"
    @ok="handleOk"
  >
    <a-form-model layout="horizontal" labelAlign="right" :label-col="labelCol" :wrapper-col="wrapperCol" :model="form">
        <a-row>
          <a-col :span="8">
            <a-form-model-item label="客户名称" prop="customerName">
              <a-input v-model.trim="form.customerName" placeholder="请输入客户名称" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="手机" prop="mobile">
              <a-input v-model.trim="form.mobile" placeholder="请输入手机" disabled></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="电话" prop="telephone">
              <a-input v-model.trim="form.telephone" placeholder="请输入电话" disabled></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="8">
            <a-form-model-item label="客户类型" prop="customerType">
              <z-dict-select-tag v-model="form.customerType"  dictCode="customer_type" placeholder="请选择客户类型" style="width: 100%"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <!-- tab页 -->
      <a-row>
        <a-col :span="24">
          <a-tabs default-active-key="1"  @change="tabChange">
<!--            <a-tab-pane key="1" tab="跟进记录">-->
<!--            </a-tab-pane>-->
            <a-tab-pane key="1" tab="基本信息" force-render>
              <a-row>
                <a-col :span="12">名称：{{form.customerName}}</a-col>
                <a-col :span="12">手机：{{form.mobile}}</a-col>
              </a-row>
              <a-row>
                <a-col :span="12">电话：{{form.telephone}}</a-col>
                <a-col :span="12">网址：{{form.website}}</a-col>
              </a-row>
              <a-row>
                <a-col :span="12">下次联系时间：{{form.nextTime}}</a-col>
                <a-col :span="12">备注：{{form.remark}}</a-col>
              </a-row>
              <a-row>
                <a-col :span="12">成交状态：{{form.dealStatus_dictText}}</a-col>
                <a-col :span="12">类型：{{form.customerType_dictText}}</a-col>
              </a-row>
              <a-row>
                <a-col :span="12">行业：{{form.a}}</a-col>
                <a-col :span="12">信息来源：录入</a-col>
              </a-row>
              <a-row>
                <a-col :span="12">定位：{{form.location}}</a-col>
                <a-col :span="12">区域：{{form.address}}</a-col>
              </a-row>
              <a-row>
                <a-col :span="12">详细地址：{{form.detailAddress}}</a-col>
              </a-row>
            </a-tab-pane>
            <a-tab-pane key="2" tab="联系人" force-render>
                <a>联系人</a>
            </a-tab-pane>
            <a-tab-pane key="3" tab="商机" force-render>
                <a>商机</a>
            </a-tab-pane>
            <a-tab-pane key="4" tab="合同" force-render>
              <a>合同</a>
            </a-tab-pane>
            <a-tab-pane key="6" tab="附件" force-render>
              <!--<a-table :columns="files.columns" :data-source="files.data" :pagination="false" :scroll="{x:true}" class="j-table-force-nowrap">
              </a-table>-->
              <!-- <upload-table text="上传" ref="uploadTable" :batchId="this.form.batchId"></upload-table> -->
            </a-tab-pane>

          </a-tabs>
        </a-col>
      </a-row>
    </a-form-model>
    <template slot="footer">
      <a-button  @click="handleCancel">取消</a-button>
      <a-button type="primary" @click="handleOk">确定</a-button>
      <a-button type="primary" @click="transTo">转移</a-button>
    </template>
  </a-modal>
</template>

<script>
import ModalFormMixin from '@/mixins/ModalFormMixin'
import ZDictSelectTag from '@/components/dict/ZDictSelectTag'

export default {
  name: 'CrmCustomerModal',
  mixins: [ModalFormMixin],
  components: {
    ZDictSelectTag,
  },
  data() {
    return {
      title:'',
      width:1200,
      visible: false,
      form:{},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
    }
  },
  methods: {
    open(record){
      this.form = Object.assign({}, record);
      this.visible = true;
      this.title = form.customerName;
    },
    close() {
      this.$emit('close');
      this.visible = false;
    },
    handleOk() {
      this.close()
    },
    handleCancel() {
      this.close()
    },
    //转移
    transTo(){
    },
  }
}
</script>